<?php 
    $this->headScript()
        ;
?>

<?php $this->headStyle()->captureStart() ?>
#sortable { list-style-type: none; margin: 0; padding: 0; }
#sortable li {list-style:none; margin: 10px 0 10px 0; padding: 0.5em; padding-left: 1.5em; line-height: 26px; border:1px solid #ccc;}
#sortable li span.move {margin:6px 0 0 0; cursor:move; float:left;}
#sortable li span.delete {margin:6px 0 0 20px; cursor:pointer; float:left;}

<?php $this->headStyle()->captureEnd() ?>

<?php $this->headScript()->captureStart() ?>
$(document).ready(function(){
    $( "#sortable" ).sortable({
        opacity: 0.6,
        revert: true,
        cursor: 'move',
        handle: '.move', 
        update: function(event, ui){
            var newOrder = [];   
            $( "#sortable" ).find("input[name='linkId']").each(function() {   
                newOrder.push(this.value);   
            });
            $.ajax({   
                type: "post",   
                url: "<?php echo $this->url(array('module'=>'admin', 'controller'=>'blog-link', 'action'=>'save-order'),'default',true) ?>",
                data: { newOrder: newOrder},
                beforeSend: function() {   
                },   
                success:function(responseText, statusText)
                {
                    //alert(responseText);
                    var json = jQuery.parseJSON(responseText);
                    if(json.result != 1){
                        dialogMessage(json.messages);
                        return false;
                    }
                    return true;
                }, 
             }); 
        }
    });

    $(".delete").live('click',function(){ 
        var linkId   = $(this).attr("data-linkId");
        var currLink = $("li[data-linkId=" + linkId + "]");
        //alert(currRecommendTag.html());
        
        dialogConfirm($.languages.areYouSureToDelete, function(){
            $.ajax({ 
                type: "POST", 
                url: "<?php echo $this->url(array('module'=>'admin', 'controller'=>'blog-link', 'action'=>'delete-link'),'default',true) ?>", 
                data: { linkId : linkId},
                success:function(responseText, statusText){
                    var json = jQuery.parseJSON(responseText);
                    if(json.result != 1){ 
                        dialogMessage(json.messages);
                        return false;
                    }

                    currLink.remove(); 
                    return false;
                } 
            });
        });
    }); 

    var options = { 
        type:"POST",
        dataType : "text",
        buttons:$('#mainForm').find("input[name='submit']"),
        async : true,
        cache: false,
        success:function(responseText, statusText)
        {
            //alert(responseText);
            var json = jQuery.parseJSON(responseText);
            
            if(json.result != 1){ 
                dialogMessage(json.messages);
                return false;
            }
            
            $( "#sortable" ).append(json.content); 
            
            return true;
        },
    };
    var v = jQuery("#mainForm").validate({
        debug: true,
        messages: {
            siteName: {
                required: "<?php echo $this->translate("Site name is required.");?>",
            },
            siteLink: {
                required: "<?php echo $this->translate("Site link is required.");?>",
                url: "<?php echo $this->translate("Please enter a right site link.");?>",
            },
        },
        rules: {
            siteName: {
                required: true,
            },
            siteLink: {
                required: true,
                url: true,
            },
        },
        errorPlacement: function(error, element) {
            var elementName = element.attr("name");
            var idTip = 'tip-' + elementName;
            $("#" + idTip).html(error);
        },
        success: function(label) {
            label.addClass("valid").text("Ok!")
        },
        submitHandler: function(form) {
            jQuery(form).ajaxSubmit(options);
        }
    });

});
<?php $this->headScript()->captureEnd() ?>

<?php $this->headScript()->captureStart() ?>
$(document).ready(function() {
    
    var optionsBase = {
        "callback": function( sValue, y ) {},
        "cssclass"   : 'jeditable',
        "method"     : 'POST',
        "event"      : 'dblclick',
        "tooltip"    : 'Click to edit',
        "placeholder": '&nbsp;',
        "submit"     : 'Ok',
        "cancel"     : 'Cancel',
        "onblur"     : 'ignore',
        "submitdata" : function ( value, settings ) {
            var _linkId = $(this).attr("data-linkId").trim();
            var _column = $(this).attr("data-column").trim();

            return {
                "linkId" : _linkId,
                "column" : _column,
            };
        },
        "height"    : null,
        "width"     : null,
    }
    var _jeditableSubmitUrl = '<?php echo $this->url(array('module'=>'admin', 'controller'=>'blog-link', 'action'=>'save-link-for-jeditable')); ?>';
    var _jeditableLoadUrl   = '<?php echo $this->url(array('module'=>'admin', 'controller'=>'blog-link', 'action'=>'get-link-for-jeditable')); ?>';

    var optionsExtend = {
        "type"    : "text",
        "loaddata": function ( value, settings ) {
            var _linkId = $(this).attr("data-linkId").trim();
            var _column = $(this).attr("data-column").trim();

            return {
                "linkId" : _linkId,
                "column" : _column,
            };
        },
        "loadtype": 'POST',
        "loadurl" : _jeditableLoadUrl,
    }
    var options = $.extend({}, optionsBase, optionsExtend);
    $('span.jeditable-box').editable( _jeditableSubmitUrl, options);
});
<?php $this->headScript()->captureEnd() ?>


<div class="append-top prepend-top">
<?php echo $this->translate("Link list");?>
<hr>
</div>
<div class="append-top prepend-top">
    <ul id="sortable"> 
    <?php if(is_array($this->links)):?>
    <?php foreach ($this->links as $link):?>
        <?php 
        echo $this->partial('module_admin_script_blog-link-li.phtml', array(
                'link' => $link,
            ));
        ?>
    <?php endforeach;?>
    <?php endif;?>
    </ul>
</div>

<div class="append-top prepend-top">
<?php echo $this->translate("Add link");?>
<hr>
</div>

<div class="append-top prepend-top">
    <?php echo $this->addLinkForm;?>
</div>
